import React, { Component } from "react";
import PageHeader from "../components/pageHeader";
import OmsRadio from "../components/common/omsRadio";
import {Notice} from '../../config/omsLayer';
import _Http from "../../config/api";
export default class NoticeList extends Component{
  constructor(props){
    super(props);
    this.state = {
      translate:{
        cn:{
          "公告管理" : "公告管理",
          "系统管理" : "系统管理",
          "添加" : "添加",
          "类型" : "类型",
          "标题" : "标题",
          "内容" : "内容",
          "附件" : "附件",
          "发布" : "发布",
          "请选择类型" : "请选择类型",
          "标题不能为空" : "标题不能为空",
          "内容不能为空" : "内容不能为空",
          "发布成功" : "发布成功",
        },
        en:{
          "公告管理" : "Announcement management",
          "系统管理" : "System management",
          "添加" : "Add",
          "类型" : "Type",
          "标题" : "Title",
          "内容" : "Content",
          "附件" : "Attachment",
          "发布" : "Publish",
          "请选择类型" : "Please select the type",
          "标题不能为空" : "Title cannot be blank",
          "内容不能为空" : "Content cannot be empty",
          "发布成功" : "Publish successfully",
        }
     }
    }
    this.handleSubmit = this.handleSubmit.bind(this);
  }
  pageTr(){
    var _this = this,
        langIndex = _this.props.langKey,
        page = _this.state.translate[langIndex];
    return page;
  }
  validateForm(item, jq){
    var _this = this,
        page = _this.pageTr(),
        tempPos1 = jq('#'+item).find("input[name='belong']"),
        tempPos2 = jq('#'+item).find("input[name='title']"),
        tempPos3 = jq('#'+item).find("textarea[name='content']");

    return Notice.isEmpty([
      {val:tempPos1.filter(':checked').val(), item:tempPos1.eq(0), msg:page['请选择类型']},
      {val:tempPos2.val(), item:tempPos2, msg:page['标题不能为空']},
      {val:tempPos3.val(), item:tempPos3, msg:page['内容不能为空']},
    ]);
  }

  handleSubmit(e) {
    var _this = this,
        formId = _this.refs.myForm.id,
        page = _this.pageTr(),
        langIndex = _this.props.langKey;
    (function($){
        if( _this.validateForm(formId, $)){
          _Http.post('/system/notice.php?action=add', $('#'+formId).serialize())
            .then(function () {
              Notice.successTips(page['发布成功']);
              setTimeout(function(){
                _this.props.history.push('/system/notice');
              },1500);
            })
            .catch(function (error) {
              Notice.errorTips(error[langIndex]);
            });
        } 
    })(window.jQuery)

    e.preventDefault();//阻止表单的常规提交
  }
  componentWillUnmount(){
     // 组件即将销毁
     Notice.closeAll();
  }

  render(){
    var _this = this,
        page = _this.pageTr();
    return(
      <div id="content">
        <PageHeader data={{title:page['添加'],crumb:[page['系统管理'],page['公告管理'],page['添加']]}}></PageHeader>
        <div id="contents" className="container-fluid">
          <div className="panel panel-default">
            <div className="panel-heading">
              <h3 className="panel-title"><i className="fa fa-pencil"></i>{page['添加']}</h3>
            </div>
            <div className="panel-body  form-horizontal">
              <form id="noticeForm" action="#" method="post" ref="myForm" encType="multipart/form-data" onSubmit={_this.handleSubmit}>
                <div className="form-group">
                    <label className="col-sm-2 control-label"><label className="red">*</label>{page['类型']}</label>
                    <div className="col-sm-10">
                        <OmsRadio radioValue={_this.props.location.belong} data={[
                            {title:'OMS公告',type:'radio',name:'belong',val:'oms'},
                            {title:'TR公告',type:'radio',name:'belong',val:'tr'}
                          ]}>
                        </OmsRadio>
                    </div>
                </div>
                <div className="form-group">
                    <label className="col-sm-2 control-label"><label className="red">*</label>{page['标题']}</label>
                    <div className="col-sm-10 title-div">
                        <input className="form-control" name="title" />
                    </div>
                </div>
                <div className="form-group">
                    <label className="col-sm-2 control-label"><label className="red">*</label>{page['内容']}</label>
                    <div className="col-sm-10 title-div">
                        <textarea className="form-control" name="content" id=""></textarea>
                    </div>
                </div>
                <div className="form-group">
                    <label className="col-sm-2 control-label">{page['附件']}</label>
                    <div className="col-sm-10 title-div">
                      <input className="form-control" name="attachment[]"  />
                    </div>
                </div>
                <div className="form-group">
                    <label className="col-sm-2 control-label"></label>
                    <div className="col-sm-10 title-div">
                        <button type="submit" className="btn btn-primary btn-sm">{page['发布']}</button>
                    </div>
                </div>
              </form>
              
            </div>
          </div>
        </div>
      </div>
    );

  }
}